<template>
  <div>
    <el-dialog width="600px" title="确认订单" :close-on-click-modal="false" :visible.sync="isShowOilConfirm" center @closed="isShowOilConfirm = false">
      <el-form>
        <el-form-item label="订单号：" prop="userName" :label-width="formLabelWidth">{{form.orderNo}}</el-form-item>
        <el-form-item label="预约时间：" :label-width="formLabelWidth">{{form.deliveryDt}}</el-form-item>
        <el-form-item label="预约电话：" :label-width="formLabelWidth">{{ form.customerPhone | hidePhoneFourRank }} </el-form-item>
        <el-form-item label="预约数量：" :label-width="formLabelWidth">{{form.ton}}吨</el-form-item>
        <div class="plan">为了用户体验，请您快速确认用户的加油计划。</div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button class="close" @click="isShowOilConfirm = false" size="medium">关 闭</el-button>
        <el-button class="search-btn" type="primary" :loading="loading" @click="reservationOrderConfirmApi" size="medium">确认订单</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import { reservationOrderConfirm } from '@/api/order'
export default {
  data () {
    return {
      formLabelWidth: '130px',
      isShowOilConfirm: false,
      form: {},
      loading: false
    }
  },
  methods: {
    init (params) {
      const { orderNo, deliveryDt, customerPhone, ton } = params
      this.form = { orderNo, deliveryDt, customerPhone, ton }
      this.isShowOilConfirm = true
    },
    // 提交
    async reservationOrderConfirmApi () {
      this.loading = true
      try {
        const { code } = await reservationOrderConfirm({ orderNo: this.form.orderNo })
        if (code !== 200) return
        this.$message.success('订单确认成功')
        this.$emit('handleBtn')
      } catch (e) {
        console.log(e)
      } finally {
        this.isShowOilConfirm = false
        this.loading = false
      }
    }
  }
}
</script>
<style lang="less" scoped>
.search-btn{
  background: #3669EB;
}
.close{
  background: #eeeeee;
}
.plan{
  padding: 0 35px;
  text-align: center;
  color: #E31937;
  font-size: 14px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
}
</style>
